<template>
	<view class="content">
		
		<view class="rows" v-for="(item,index) in rowsList" :key="index" @tap="thisDetials(item)">
			<view class="topBox">
				<view class="orange_bg">单领优品</view>
				<view class="name overflow_one">{{item.title}}</view>
			</view>
			<view class="centerBox">
				<view class="centerTitle color_orange fontSize12">{{item.type}}</view>
				<view class="centerTitle fontSize12">{{item.goods}}</view>
				<view class="clearBoth"></view>
			</view>
			<view class="footerBox">
				<view class="addrPosition overflow_one fontSize12">{{item.space}}</view>
				<view class="addrDetails overflow_one fontSize12">{{item.details}}</view>
			</view>
			<image class="icon" src="/pages_kafei/pages/static/icon_1.png" mode=""></image>
			<view class="clearBoth"></view>
		</view>
		
		
		<view class="positionIcon" style="bottom:20%" @tap="toOrder">
			<image class="icons" src="/pages_kafei/pages/static/icon_3.png" mode=""></image>
			<view class="iconName">订单</view>
		</view>
		
		<view class="positionIcon" style="bottom:5%" @tap="toAddr">
			<image class="icons" src="/pages_kafei/pages/static/icon_2.png" mode=""></image>
			<view class="iconName">地图</view>
		</view>
		
		
		
		
	</view>
</template>
<style>
	.content{width: 100%;min-height:100vh;background-color: rgb(245,245,249);padding-top: 2upx;position: relative;}
	.content .rows{width: 90%;margin-left: 5%;padding:3% 5%;border-radius: 10upx;background: white;margin-top: 40upx;}
	.content .rows .topBox,
	.content .rows .centerBox,
	.content .rows .footerBox{width: 90%;float: left;}
	.content .rows .icon{width: 60upx;height: 60upx;float: right;}
	.content .rows .topBox .orange_bg{font-size: 22upx;color:white;background: #DC582A;float: left;padding:10upx;border-radius: 10upx;margin-right: 20upx;}
	.content .rows .topBox .name{font-size: 32upx;color:#262626;float: left;padding-top: 4upx;font-weight: bold;}
	.content .rows .centerBox .centerTitle{color:#999999;float:left;margin-top:20upx;margin-right: 20upx;}
	.content .rows .centerBox .color_orange{color:#DC582A;float:left;margin-top:20upx}
	.content .rows .footerBox .addrPosition{width: 30%;margin-right: 20upx;color:#262626;float: left;margin-top:20upx}
	.content .rows .footerBox .addrDetails{width:65%;color:#262626;float: left;margin-top:20upx}
	.content .positionIcon{position: fixed;right:5%;z-index: 2;}
	.content .positionIcon .icons{width: 40upx;height:40upx;margin-left: 5upx;}
	.content .positionIcon .iconName{color:#283266;font-size: 20upx;width:50upx;}

</style>
<script>
	import Share from '@/common/wx_share.js'
	export default {
		data() {
			return {
				share:{
					title:"",
					path:'/pages/tabbar/index',
					imageUrl:'',
					desc:'',
					content:''
				},
				data:{
					lat:"",
					lng:""
				},
				rowsList:[
					// {
					// 	id:1,
					// 	title:"标题",
					// 	type:"营业中",
					// 	goods:"24小时",
					// 	space:"24m",
					// 	details:"这是具体位置"
					// },
					// {
					// 	id:1,
					// 	title:"标题",
					// 	type:"营业中",
					// 	goods:"24小时",
					// 	space:"24m",
					// 	details:"这是具体位置"
					// },
					// {
					// 	id:1,
					// 	title:"标题",
					// 	type:"营业中",
					// 	goods:"24小时",
					// 	space:"24m",
					// 	details:"这是具体位置"
					// }
				],
			}
		},
		onLoad(){
			var that = this;
			uni.getLocation({
				// type: 'wgs84',
				type: 'gcj02',
				success: function (res) {
					that.data.lng = res.longitude
					that.data.lat = res.latitude
					that.AjaxLoad()
				},
				error:function(e){},
			});
			that.AjaxLoad()
		},
		methods: {
			AjaxLoad(){
				var rowsList = []
				let param={
					token:this._$userToken("userInfo").token,
					lng:this.data.lng,
					lat:this.data.lat
					// lng: 106.5686,
					// lat: 29.55314
				};
				this._$InitRequest.request("coffee/make_list", param).then(res => {
					res.data.forEach( (item,index) =>{
						rowsList.push({
							title:item.name,
							type:"营业中",
							goods:"24小时",
							space:item.distance+"m",
							details:item.address,
							latitude:item.lat,
							longitude:item.long,
							machine_code:item.machine_code,
							model_id:item.model_id,
						})
					})
					for (var i = 0; i < rowsList.length; i++){this.rowsList.push( rowsList[i] )}
				},error=>{})
			},
			thisDetials(item){
				uni.navigateTo({
					url:"/pages_kafei/pages/kafeiList_son/kafeiList_son?machine_code=" + item.machine_code + "&model_id=" + item.model_id
				})
			},
			toOrder(){
				uni.navigateTo({
					url:"/pages_kafei/pages/order/order"
				})
			},
			toAddr(){
				uni.navigateTo({
					url:"/pages_kafei/pages/addr/addr"
				})
			},
			
		}
	}
</script>
<style lang="scss" scoped>
/deep/ .uni-input-input {font-size:32upx}
/deep/ .uni-radio-input-checked{background-color:rgb(110,43,34) !important;border:2upx solid white !important}
.content .html{
  ::v-deep {
    img {
      width: 100%;
    }
  }
}
</style>